<template>
  <div id="app">
    <!-- <img src="./assets/logo.png"> -->
    <ul>
      <li v-for="user in users" :key="user.id">
        {{user.title}} -- {{user.completed}}
      </li>
    </ul>

    <button @click="corAjaxRequest">跨域ajax请求</button>

  </div>
</template>

<script>
  export default {
    name: 'App',
    data() {
      return {
        users: []
      }
    },
    methods: {
      // Access to XMLHttpRequest at 'http://10.211.55.2:54321/json.data.json' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
      // 本地链接 : localhost:8080 
      // 明显跨域了.
      corAjaxRequest() {
        
      }
    },
    created() {
      this.axios.get('/api/json.data.json')
          .then(response => {
            this.users = response.data.todoList
            console.log(this.users.todoList)
          })
          .catch(error => {
            console.log(error)
          })
    },  
  }

</script>

<style>
</style>
